<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layuiAdmin 控制台主页一</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/layuiAdmin/dist/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuiAdmin/dist/layuiadmin/style/admin.css" media="all">
    <script src="/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
    <style>
        .blue-color{
            color: #00a2d4;
            font-size: 25px;
            margin-top: 20px;
        }
        .red-color{
            color: #f43838;
            font-size: 25px;
            margin-top: 20px;
        }
        .layui-card-body{
            padding-left: 50px;
        }
        ul{
            padding-bottom: 20px;
        }
        ul li{
            padding: 55px 10px !important;
            display: flex;
            align-items: center;
        }
        ul li:last-child{
            border-bottom: none;
        }
        a{
            font-size: 25px;
            
        }
        .layui-icon{
            font-size: 48px;
            margin-right: 30px;
        }
    </style>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md8" style="width:100%;">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">数据概览</div>
                        <div class="layui-card-body">
                            <div class=" " data-anim="fade">
                                <div>
                                    <ul>
                                        <li style="border-bottom: 1px solid #d7d7d7;padding:10px;">
                                            <img class="layui-icon" src="/images/member.png" alt="" />
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/user_index/index">
                                                    <div>用户总数</div>
                                                </a>
                                                    <div class="blue-color">{$setting_data.user.count}</div>
                                            </div>
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/business/index">
                                                <div>门店总数</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.business.count}</div>
                                            </div>
                                            <div style="clear: both"></div>
                                        </li>
                                        <li style="border-bottom: 1px solid #d7d7d7;padding:10px;">
                                            <img class="layui-icon" src="/images/goods.png" alt="" />
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/script/index">
                                                <div>剧本总数</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.script.count}</div>
                                            </div>
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/script/index?type=1">
                                                <div>平台添加</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.script.pt}</div>
                                            </div>
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/script/index?type=2">
                                                    <div>门店添加</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.script.md}</div>
                                            </div>
                                            <div style="clear: both"></div>
                                        </li>
                                        <li style="border-bottom: 1px solid #d7d7d7;padding:10px;">
                                            <img class="layui-icon" src="/images/order.png" alt="" />
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/order_fleet/index">
                                                <div>累计车队总数</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.order_fleet.count}</div>
                                            </div>
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/order_fleet/index">
                                                <div>已完成车队总数</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.order_fleet.wc}</div>
                                            </div>
                                            <div style=" display: inline-block;width: 20%">
                                                <a lay-href="/admin/order_fleet/index">
                                                    <div>已完成车队中人数</div>
                                                </a>
                                                <div class="blue-color">{$setting_data.order_member.wc}</div>
                                            </div>
                                            <div style="clear: both"></div>
                                        </li>

                                    </ul>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

<script src="/js/jquery-2.1.1.min.js">

</script>
<script>
	
    layui.config({
        base: '/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'admin', 'carousel', 'echarts'], function () {
    	
        
        //区块轮播切换
        var $ = layui.$
            , admin = layui.admin
            , carousel = layui.carousel
            , element = layui.element
            , echarts = layui.echarts
            , device = layui.device();
        //轮播切换
        $('.layadmin-carousel').each(function () {
            var othis = $(this);
            carousel.render({
                elem: this
                , width: '100%'
                , arrow: 'none'
                , interval: othis.data('interval')
                , autoplay: othis.data('autoplay') === true
                , trigger: (device.ios || device.android) ? 'click' : 'hover'
                , anim: othis.data('anim')
            });
        });

        element.render('progress');
        var echartsApp = [];
        var options;
        $.ajax({
            url: "{:url('path')}",
            success: function (res) {
                options = res.data;
                var elemDataView = $('#LAY-index-dataview').children('div');
                var renderDataView = function (index) {
                    echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
                    echartsApp[index].setOption(options[index]);
                    window.onresize = echartsApp[index].resize;
                    admin.resize(function () {
                        echartsApp[index].resize();
                    });
                };


                //没找到DOM，终止执行
                if (!elemDataView[0]) return;


                renderDataView(0);

                //监听数据概览轮播
                var carouselIndex = 0;
                carousel.on('change(LAY-index-dataview)', function (obj) {
                    renderDataView(carouselIndex = obj.index);
                });

                //监听侧边伸缩
                layui.admin.on('side', function () {
                    setTimeout(function () {
                        renderDataView(carouselIndex);
                    }, 300);
                });

                //监听路由
                layui.admin.on('hash(tab)', function () {
                    layui.router().path.join('') || renderDataView(carouselIndex);
                });
            }
        })
		if(window.screen.width < 990){
    		$(".layui-card-body").find(".layadmin-dataview").css('cssText','height:100%!important');
        }
    });

    //最新订单
    layui.use('table', function () {
        var $ = layui.$
            , table = layui.table;

        //今日热搜
        table.render({
            elem: '#LAY-index-topSearch'
            , url: layui.setter.base + 'json/console/top-search.js' //模拟接口
            , page: true
            , cols: [[
                {type: 'numbers', fixed: 'left'}
                , {
                    field: 'keywords',
                    title: '关键词',
                    minWidth: 300,
                    templet: '<div><a href="https://www.baidu.com/s?wd={{ d.keywords }}" target="_blank" class="layui-table-link">{{ d.keywords }}</div>'
                }
                , {field: 'frequency', title: '搜索次数', minWidth: 120, sort: true}
                , {field: 'userNums', title: '用户数', sort: true}
            ]]
            , skin: 'line'
        });

        //今日热贴
        table.render({
            elem: '#LAY-index-topCard'
            , url: layui.setter.base + 'json/console/top-card.js' //模拟接口
            , page: true
            , cellMinWidth: 120
            , cols: [[
                {type: 'numbers', fixed: 'left'}
                , {
                    field: 'title',
                    title: '标题',
                    minWidth: 300,
                    templet: '<div><a href="{{ d.href }}" target="_blank" class="layui-table-link">{{ d.title }}</div>'
                }
                , {field: 'username', title: '发帖者'}
                , {field: 'channel', title: '类别'}
                , {field: 'crt', title: '点击率', sort: true}
            ]]
            , skin: 'line'
        });
    });

</script>
</body>
</html>

